<template>
  <div class="home-about-content">
    <div class="home-about-title">我们的实力让您放心我们的团队让您省心</div>
    <div class="info-content" v-if="pc">
      <div class="info-box">
        <div class="info-left">
          <div class="info-number">1000+</div>
          <div class="info-text">
            <p>IT管家已服务客户数</p>
            <p class="tow">每周增长约22%</p>
          </div>
        </div>
        <div class="info-flex">
          <div class="info-number">5000+</div>
          <div class="info-text">
            <p>小规模财务专家客户数</p>
            <p class="tow">每周增长约22%</p>
          </div>
        </div>
        <div class="info-right">
          <div class="info-number">2000+</div>
          <div class="info-text">
            <p>专职会计专家从业人员</p>
            <p class="tow">注册会计师比例10%</p>
          </div>
        </div>
      </div>
      <div class="info-box">
        <div class="info-left">
          <div class="info-number">2500+</div>
          <div class="info-text">
            <p>IT管家月客户咨询数量</p>
            <p class="tow">问题解决率95%</p>
          </div>
        </div>
        <div class="info-flex">
          <div class="info-number">1000+</div>
          <div class="info-text">
            <p>一般纳税人财务专家客户数</p>
            <p class="tow">每周增长约22%</p>
          </div>
        </div>
        <div class="info-right">
          <div class="info-number">500+</div>
          <div class="info-text">
            <p>名运维专家及IT开发工程师</p>
            <p class="tow">本科学历占比55%</p>
          </div>
        </div>
      </div>
    </div>
    <div class="info-content" v-else>
      <div class="info-box">
        <div class="info-item">
          <div class="info-number">1000+</div>
          <div class="info-text">
            <p>IT管家已服务客户数</p>
            <p class="tow">每周增长约22%</p>
          </div>
        </div>
        <div class="info-item">
          <div class="info-number">5000+</div>
          <div class="info-text">
            <p>小规模财务专家客户数</p>
            <p class="tow">每周增长约22%</p>
          </div>
        </div>
        <div class="info-item">
          <div class="info-number">2000+</div>
          <div class="info-text">
            <p>专职会计专家从业人员</p>
            <p class="tow">注册会计师比例10%</p>
          </div>
        </div>

        <div class="info-item">
          <div class="info-number">2500+</div>
          <div class="info-text">
            <p>IT管家月客户咨询数量</p>
            <p class="tow">问题解决率95%</p>
          </div>
        </div>
        <div class="info-item">
          <div class="info-number">1000+</div>
          <div class="info-text">
            <p>一般纳税人财务专家客户数</p>
            <p class="tow">每周增长约22%</p>
          </div>
        </div>
        <div class="info-item">
          <div class="info-number">500+</div>
          <div class="info-text">
            <p>名运维专家及IT开发工程师</p>
            <p class="tow">本科学历占比55%</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { IsPC } from "@/common/utils";
import { ref } from "vue";

const pc = ref(IsPC());
</script>
<style lang="less">
@import "@/style/var.less";
@import "./index.less";
</style>
